<template>
  <div class="pagestyle">
    <list_controller :style="{ width: state.listBtnType == 6 ? '78%' : '100%' }" ref="zujianname"
      :options="state.options" :showCaozuo="true">
      <template v-slot:opraCurdBtnAll>
        <span :class="state.listBtnType == 1 ? 'listInfoBtn active' : 'listInfoBtn'" @click="listInfoBtnClick(1)">
          <svg-icon :class="state.listBtnType == 1 ? 'active' : ''" class-name="search-icon" icon-class="qiehuan" />
          历史标校
        </span>
        <span :class="state.listBtnType == 2 ? 'listInfoBtn active' : 'listInfoBtn'
          " @click="listInfoBtnClick(2)">
          <svg-icon :class="state.listBtnType == 2 ? 'active' : ''" class-name="search-icon"
            icon-class="shouyetaishifenxi" />
          态势分析
        </span>
      </template>
      <template v-slot:selectNamelist> 标校信息 </template>
      <template v-slot:listSS="{ row, field }">
        <div v-if="field == 'sensorType'">
          <el-tag type="primary" v-if="row.sensorType == '开关量'">
            {{ row.sensorType }}
          </el-tag>
          <el-tag style="color:#7777ee;border-color:#7777ee;" color="rgba(119, 119, 238, 0.1)"
            v-if="row.sensorType == '模拟量'">
            {{ row.sensorType }}
          </el-tag>
        </div>
      </template>
    </list_controller>
    <!-- 详情 -->
    <el-drawer v-model="state.drawerShow" direction="rtl" size="50%" close-on-click-modal :modal="true">
      <template #header="{ close, titleId, titleClass }">
        <h4 class="mask_sub_title" style="color:#3E464F;margin:0;">
          <svg-icon class-name="search-icon" icon-class="biaotitubiao" /><span>态势分析</span>
        </h4>
      </template>
      <div>
        <realChartCom :pointDataList="state.pointDataList" :drawerShow="state.drawerShow" :nomoreType="1">
        </realChartCom>
      </div>
    </el-drawer>
  </div>
</template>
<script setup>
import list_controller from "@/components/commonCom/list_controller";
import realChartCom from "./listCom/realChartCom.vue";
import {
  computed,
  nextTick,
  onActivated,
  onMounted,
  onUnmounted,
  reactive,
  ref,
  watch,
  inject,
} from "vue";
import { table_headers } from "@/components/commonCom/table_headers";
import { ElMessage, ElMessageBox, ElNotification } from "element-plus";
import axios from "@/utils/request";
import usePagesStore from "@/store/modules/pages";
import dayjs from "dayjs";
const { proxy } = getCurrentInstance();
const store = usePagesStore();
const router = useRouter();
let previewHttps = import.meta.env.VITE_APP_HTTP;
const upload = ref(null);
let timer
let state = reactive({
  detailsShow: false,
  detailsList: [],
  fillayaComShow: false, //控制填写分析抽屉显示
  listBtnType: undefined,
  options: {
    refreshShow: true,
    tableheads: computed(() => table_headers.waitCalibration),
    listSS: [
      { field: "sensorType" },
    ],
    queryList: {
      querys: [],
    },
    dataUrl: "/realPointCalibration/attainCalibrationList",
  },
  // 表单
  drawerShow: false,
  pointDataList: [],
});

// 新增按钮
function listInfoBtnClick(type) {
  state.listBtnType = type;
  if (type == 1) {
    goPage()
  }
  if (type == 2) {
    if (proxy.$refs.zujianname.vxe.state.records.length > 0) {
      state.drawerShow = true
      state.pointDataList = proxy.$refs.zujianname.vxe.state.records

    } else {
      proxy.$modal.msgWarning('请先选择数据!')
    }
  }
}

// 跳转历史标校页面
const goPage = () => {
  router.push({ name: 'Cx_hisCalibList' })
}
</script>
<style lang="scss" scoped>
.xiazai {
  position: absolute;
  top: 42px;
  right: 110px;
  width: 120px;
  height: 64px;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: space-between;
  background-color: #ffff;
  box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.12);
  border-radius: 2px;
  z-index: 99;

  .item {
    width: 100%;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }

  .item:hover {
    background-color: rgba(91, 109, 128, 0.08);
  }
}

.pagestyle {
  display: flex;
  justify-content: space-between;
}
</style>
